import { useMemo, useRef } from "react";

export interface UseFullScreenContext {
	wrapClassName: string | undefined;
	modalWrapperRef: ComponentRef;
	extHeightRef: number;
}

export function useFullScreen(context: UseFullScreenContext) {
	const fullScreenRef = useRef(false);

	const getWrapClassName = useMemo(() => {
		const clsName = context.wrapClassName || "";
		return fullScreenRef.current ? `fullscreen-modal ${clsName} ` : clsName;
	}, []);

	function handleFullScreen(e: Event) {
		e && e.stopPropagation();
		fullScreenRef.current = !fullScreenRef;
	}
	return { getWrapClassName, handleFullScreen, fullScreenRef };
}
